<template>
   <van-swipe :autoplay="3000" lazy-render @change="changeImg" :initial-swipe="startIndex">
                <van-swipe-item v-for="(item, index) in image" :key="index" @click="previewImg(index)">
                    <img :src="item"/>
                </van-swipe-item>
            </van-swipe>
</template>
<script>
    export default {
        props:['image'],
        data(){
            return{
                startIndex:0
            }
        },
        methods:{
        previewImg(index){
            showImagePreview({
            images:this.image,
            startPosition:index,
            swipeDuration:2000,
            onChange:(idx)=>{
            this.startIndex=idx
            }
        })
        },
        changeImg(index){
            this.startIndex=index
        }
        }
    }
</script>

<style lang="less" scoped>
    .van-swipe-item {
        font-size: 0;
        img {
            width: 100%;
            height: auto;
            display: block;
        }
    }
</style>